<template>
  <div>
    <el-card style="overflow-y:auto;overflow-x:hidden;">
      <div slot="header" class="clearfix">
        <span>学校</span>
      </div>
      <div>
        <el-table
          :height="tableHeight"
          :max-height="tableHeight"
          @cell-click="schoolHandle"
          :cell-style="()=>{return 'color: #0EA5E9;'}"
          :data="data"
          border
          style="width: 100%">
          <el-table-column
            align="center"
            prop="name"
            label="校名">
          </el-table-column>
          <el-table-column
            align="center"
            prop="chargerName"
            label="校长">
          </el-table-column>
        </el-table>
      </div>
    </el-card>
  </div>
</template>

<script>
export default {
  name: "SchoolForm",
  props: {
    data: Array,
  },
  data() {
    return {
      tableHeight: window.innerHeight - 220,
    }
  },
  created() {
  },
  methods: {
    schoolHandle(row, column) {
      if (column.label == "校名") {
        this.$emit('school-session', row)
      } else if (column.label == "校长") {
        console.log(row)
      }
    },
  },
}
</script>

<style scoped>

.clearfix:before,
.clearfix:after {
  display: table;
}

.clearfix:after {
  clear: both
}
</style>
